<template>
	<view class="bottomPage">
		<view class="botli" style="margin-left:132rpx;" @click="goPage(1)" :class="suo == 0?'active':''">
			<view class="botImg" v-if="suo == 0">
				<image src="../static/lm5h.png" mode=""></image>
			</view>
			<view class="botImg" v-else>
				<view class="botImg">
					<image src="../static/lm5.png" mode=""></image>
				</view>
			</view>
			<text>首页</text>
		</view>
		
		<view class="botli" @click="goPage(2)" :class="suo == 1?'active':''">
			<view class="botImg" v-if="suo == 1">
				<image src="../static/lm4h.png" mode=""></image>
			</view>
			<view class="botImg" v-else>
				<image src="../static/lm4.png" mode=""></image>
			</view>
			<text>任务</text>
		</view>
		
		<view class="botli" style="margin-right:134rpx;" @click="goPage(3)" :class="suo == 2?'active':''">
			<view class="botImg" v-if="suo == 2">
				<image src="../static/lm6h.png" mode=""></image>
			</view>
			
			<view class="botImg" v-else>
				<image src="../static/lm6.png" mode=""></image>
			</view>
			<text>我的</text>
		</view>
	</view>
</template>

<script>
	export default {
		name:"otherBottom",
		props:{
			suo:{
				typeof: Number,
				default: 0
			}
		},
		data() {
			return {
				
			};
		},
		methods:{
			goPage(type){
				if(uni.getStorageSync('isLogout') == 1) {
					return uni.$u.toast('请先登录！');
				}
				if(type == 1) {
					uni.switchTab({
						url:'/pages/index/index'
					})
				} else if(type == 2){
					uni.switchTab({
						url:'/pages/engineer/index'
					})
				} else if(type == 3){
					uni.switchTab({
						url:'/pages/engineer/mine'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.bottomPage{
	width:100%;height:172rpx;background-color:#fff;position: fixed;bottom:0;
	left:0;box-shadow: 0px 0px 30rpx 0px rgba(0, 0, 0, 0.07);@include flx;padding:0;justify-content: space-between;
	box-shadow: 0px -4px 16px 0px rgba(0,0,0,0.04), 0px 0px 24px -8px rgba(0,0,0,0.03);
	.botli{
		margin-top:26rpx;display: flex;flex-direction: column;align-items: center;
		.botImg{
			image{
				width:48rpx;height:48rpx;display: block;
			}
		}
		text{
			display: block;@include baseFont(20rpx,#6E6C6C,24rpx);margin-top:6rpx;
		}
	}
	.active{
		image{
			
		}
		text{
			color:#3671e9;
		}
	}
}
</style>